<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>新闻列表</title>
<link rel="stylesheet" type="text/css"
	href="${_siteThemePath}/bootstrap.css" />
<link rel="shortcut icon" href="${_siteThemePath}/img/favicon.ico" />
<script type="text/javascript" src="${_siteJsPath}/jquery.js"></script>
<script type="text/javascript" src="${_siteJsPath}/bootstrap.js"></script>
<style type="text/css">
body {
	padding-top: 20px;
	padding-bottom: 60px;
}

/* Custom container */
.container {
	margin: 0 auto;
	max-width: 1000px;
}

.container>hr {
	margin: 60px 0;
}

/* Main marketing message and sign up button */
.jumbotron {
	margin: 80px 0;
	text-align: center;
}

.jumbotron h1 {
	font-size: 100px;
	line-height: 1;
}

.jumbotron .lead {
	font-size: 24px;
	line-height: 1.25;
}

.jumbotron .btn {
	font-size: 21px;
	padding: 14px 24px;
}

/* Supporting marketing content */
.marketing {
	margin: 60px 0;
}

.marketing p+h4 {
	margin-top: 28px;
}

/* Customize the navbar links to be fill the entire space of the .navbar */
.navbar .navbar-inner {
	padding: 0;
}

.navbar .nav {
	margin: 0;
	display: table;
	width: 100%;
}

.navbar .nav li {
	display: table-cell;
	width: 1%;
	float: none;
}

.navbar .nav li a {
	font-weight: bold;
	text-align: center;
	border-left: 1px solid rgba(255, 255, 255, .75);
	border-right: 1px solid rgba(0, 0, 0, .1);
}

.navbar .nav li:first-child a {
	border-left: 0;
	border-radius: 3px 0 0 3px;
}

.navbar .nav li:last-child a {
	border-right: 0;
	border-radius: 0 3px 3px 0;
}

p {
	text-indent: 2em;
}
</style>
<script type="text/javascript">
	var _sel_li_id = '';

	$(function() {
		$("#typeList>ul>li>a")[0].click();
	});

	function catalog(tId) {
		if (_sel_li_id != '') {
			$("#li_" + _sel_li_id).removeClass("active");
		}
		$("#li_" + tId).addClass("active");
		_sel_li_id = tId;
		loadNewsList(tId);
	}

	function loadNewsList(tId) {
		$
				.ajax({
					url : '${_sitePath}/news/list/' + tId + '.html',
					type : 'POST',
					async : true,
					success : function(value) {
						$("#newsList").empty();
						if (value == '[]' || value.length < 3) {
							$("#newsList").append(
									"<tr><td>该分类下暂无任何新闻。</td></tr>");
						} else {
							var news = eval("(" + value + ")");
							for ( var i = 0; i < news.length; i++) {
								$("#newsList")
										.append(
												"<tr><td>"
														+ news[i].publish
														+ "</td><td><a href=\"${_sitePath}/news/view/" + news[i].id + ".html\" target=\"_blank\">"
														+ news[i].title
														+ "</a></td><td>"
														+ news[i].source
														+ "</td></tr>");
							}
						}
					},
					error : function(value) {
						alert("系统异常，没有正确返回数据，请联系管理员");
					}
				});
	}

</script>
</head>
<body>
	<div class="container">
		<ul class="breadcrumb">
			<li><a href="${_sitePath}/index.html">首页</a> <span
				class="divider">/</span></li>
			<li class="active">新闻列表</li>
		</ul>
		<div class="masthead">
			<div class="navbar">
				<div class="navbar-inner">
					<div id="typeList" class="container">
						<ul class="nav">
							<c:forEach var="nt" items="${_newsTypeList}">
								<li id="li_${nt.id}"><a href="#"
									onclick="catalog('${nt.id}');">${nt.name}</a></li>
							</c:forEach>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="container">
			<table id="newsList" class="table table-striped">
				<tr>
					<td>正在载入新闻列表...</td>
				</tr>
			</table>
		</div>
	</div>
</body>
</html>
